<%--
  Created by IntelliJ IDEA.
  User: 如烟
  Date: 2020/9/23
  Time: 12:07
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="description" content="Hotel Template">
    <meta name="keywords" content="Hotel, unica, creative, html">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>假日酒店</title>

    <!-- Google Font -->
    <link href="https://fonts.googleapis.com/css?family=Taviraj:300,400,500,600,700,800,900&display=swap"
          rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800&display=swap" rel="stylesheet">

    <!-- Css Styles -->
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/userCSS/bootstrap.min.css"
          type="text/css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/userCSS/font-awesome.min.css"
          type="text/css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/userCSS/flaticon.css" type="text/css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/userCSS/linearicons.css" type="text/css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/userCSS/owl.carousel.min.css"
          type="text/css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/userCSS/jquery-ui.min.css"
          type="text/css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/userCSS/nice-select.css" type="text/css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/userCSS/magnific-popup.css"
          type="text/css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/userCSS/slicknav.min.css"
          type="text/css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/userCSS/style.css" type="text/css">
</head>

<body>
<!-- Page Preloder -->
<div id="preloder">
    <div class="loader"></div>
</div>

<!-- Header Section Begin -->
<header class="header-section">
    <div class="container-fluid">
        <div class="inner-header">
            <div class="logo">
                <a href="${pageContext.request.contextPath}/user/hotelInit"><img
                        src="${pageContext.request.contextPath}/static/img/logo.png" alt=""></a>
            </div>
            <div class="container">
                <div class="row">
                    <div class="col-xl-12">
                        <nav class="main-menu mobile-menu">
                            <ul>
                                <li><a href="${pageContext.request.contextPath}/user/index">主页</a></li>
                                <li><a href="${pageContext.request.contextPath}/user/aboutusInit">关于</a></li>
                                <li><a href="${pageContext.request.contextPath}/user/homeShowInit">房间</a>
                                    <ul class="drop-menu">
                                        <li><a href="${pageContext.request.contextPath}/user/eachRoomShow?type=总统套房">总统套房</a>
                                        </li>
                                        <li><a href="${pageContext.request.contextPath}/user/eachRoomShow?type=普通海景房">普通海景房</a>
                                        </li>
                                        <li>
                                            <a href="${pageContext.request.contextPath}/user/eachRoomShow?type=单人间">单人间</a>
                                        </li>
                                        <li>
                                            <a href="${pageContext.request.contextPath}/user/eachRoomShow?type=双人间">双人间</a>
                                        </li>
                                        <li>
                                            <a href="${pageContext.request.contextPath}/user/eachRoomShow?type=三人间">三人间</a>
                                        </li>
                                    </ul>
                                </li>
                                <li><a href="${pageContext.request.contextPath}/user/serviceShowInit">服务</a></li>
                                <li><a href="${pageContext.request.contextPath}/user/newShowInit">公告</a></li>
                                <li><a href="${pageContext.request.contextPath}/user/contactInit">联系</a></li>
                            </ul>
                        </nav>
                        <span style="font-size: medium;color:rgb(174,149,72);margin-left: 200px ">
                                <c:choose>
                                    <c:when test="${user.loginName!=null}">
                                        尊敬的<a href='${pageContext.request.contextPath}/user/orderChk?userId="+ ${user.userId} +"'>${user.loginName}</a>您好
                                    </c:when>
                                    <c:otherwise>
                                        尊敬的游客您好
                                    </c:otherwise>
                                </c:choose>
                        </span>
                        <a href="${pageContext.request.contextPath}/user/reloadInit">退出登录</a>
                        <div class="top-info">
                            <img src="${pageContext.request.contextPath}/static/img/placeholder.png" alt="">
                            <span><a
                                    href="https://www.gaode.com/search?id=B001C7X368&city=510104&geoobj=103.270242%7C30.172919%7C105.552962%7C31.199055&query_type=IDQ&query=%E6%98%A5%E7%86%99%E8%B7%AF&zoom=9.35">成都市</a> </span>
                        </div>
                    </div>
                </div>
            </div>
            <div id="mobile-menu-wrap"></div>
        </div>
    </div>
</header>
<!-- Header End -->

<!-- Hero Slider Begin -->
<div class="hero-slider">
    <div class="slider-item">
        <div class="single-slider-item set-bg" data-setbg="${pageContext.request.contextPath}/static/img/slider-1.jpg">
            <div class="container">
                <div class="row">
                    <div class="col-lg-12">
                        <h1>We hope you’ll enjoy <br/>your stay.</h1>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-12">
                        <div class="slider-nav">
                            <a href="${pageContext.request.contextPath}/user/hotelInit" class="single-slider-nav">
                                <img src="${pageContext.request.contextPath}/static/img/nav-1.jpg" alt="">
                                <div class="nav-text active">
                                    <p>泳池<i class="lnr lnr-arrow-right"></i></p>
                                </div>
                            </a>
                            <a href="${pageContext.request.contextPath}/user/hotelInit" class="single-slider-nav">
                                <img src="${pageContext.request.contextPath}/static/img/nav-2.jpg" alt="">
                                <div class="nav-text">
                                    <p>桑拿<i class="lnr lnr-arrow-right"></i></p>
                                </div>
                            </a>
                            <a href="${pageContext.request.contextPath}/user/hotelInit" class="single-slider-nav last">
                                <img src="${pageContext.request.contextPath}/static/img/nav-3.jpg" alt="">
                                <div class="nav-text">
                                    <p>餐厅<i class="lnr lnr-arrow-right"></i></p>
                                </div>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Hero Slider End -->

<!-- Room Availability Section Begin -->
<section class="room-availability spad">
    <div class="container">
        <div class="room-check">
            <div class="row">
                <div class="col-lg-6">
                    <div class="room-item">
                        <div class="room-pic-slider room-pic-item owl-carousel">
                            <div class="room-pic">
                                <img src="${pageContext.request.contextPath}/static/img/room-slider/room-1.jpg" alt="">
                            </div>
                            <div class="room-pic">
                                <img src="${pageContext.request.contextPath}/static/img/room-slider/room-2.jpg" alt="">
                            </div>
                            <div class="room-pic">
                                <img src="${pageContext.request.contextPath}/static/img/room-slider/room-3.jpg" alt="">
                            </div>
                        </div>
                        <div class="room-text">
                            <div class="room-title">
                                <h2>单人间</h2>
                                <div class="room-price">
                                    <span>price</span>
                                    <h2>¥252</h2>
                                </div>
                            </div>
                            <div class="room-features">
                                <div class="room-info">
                                    <i class="flaticon-019-television"></i>
                                    <span>智能电视</span>
                                </div>
                                <div class="room-info">
                                    <i class="flaticon-029-wifi"></i>
                                    <span>Wi-Fi</span>
                                </div>
                                <div class="room-info">
                                    <i class="flaticon-003-air-conditioner"></i>
                                    <span>空调</span>
                                </div>
                                <div class="room-info">
                                    <i class="flaticon-036-parking"></i>
                                    <span>免费停车</span>
                                </div>
                                <div class="room-info last">
                                    <i class="flaticon-007-swimming-pool"></i>
                                    <span>室外泳池</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="check-form">
                        <h2>房型预览</h2>
                        <form action="#">
                            <div class="datepicker">
                                <div class="date-select">
                                    <p>From</p>
                                    <input type="text" class="datepicker-1" value="日 / 月 / 年">
                                    <img src="${pageContext.request.contextPath}/static/img/calendar.png" alt="">
                                </div>
                                <div class="date-select to">
                                    <p>To</p>
                                    <input type="text" class="datepicker-2" value="日 / 月 / 年">
                                    <img src="${pageContext.request.contextPath}/static/img/calendar.png" alt="">
                                </div>
                            </div>
                            <div class="room-quantity">
                                <div class="single-quantity">
                                    <p>成年人</p>
                                    <div class="pro-qty"><input type="text" value="0"></div>
                                </div>
                                <div class="single-quantity">
                                    <p>小孩</p>
                                    <div class="pro-qty"><input type="text" value="0"></div>
                                </div>
                            </div>
                            <div class="room-selector">
                                <p>房间</p>
                                <select class="suit-select">
                                    <option>请选择房型</option>
                                    <option value="">总统套房</option>
                                    <option value="">单人间</option>
                                    <option value="">双人间</option>
                                    <option value="">三人间</option>
                                </select>
                            </div>
                            <input type="hidden" name="userId" id="userId" value="${user.userId}">
                            <button type="button" id="loginChk"> 选择房间 <i class="lnr lnr-arrow-right"></i></button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- Room Availability Section End -->


<!-- Facilities Section Begin -->
<div class="facilities-section spad">
    <div class="container">
        <div class="facilities-content">
            <div class="row">
                <div class="col-lg-12">
                    <div class="section-title">
                        <h1>设施</h1>
                    </div>
                </div>
                <div class="col-lg-6 p-0">
                    <div class="facilities-img set-bg"
                         data-setbg="${pageContext.request.contextPath}/static/img/facilities-1.jpg"></div>
                </div>
                <div class="col-lg-6 p-0 ">
                    <div class="facilities-text-warp">
                        <div class="facilities-text">
                            <h2>健康中心</h2>
                            <p>Lorem ipsum dolor sit amet, consectetur adipis-cing elit. Mauris tincidunt consectetur
                                turpis, eget consequat.</p>
                            <a href="#" class="primary-btn fac-btn">参观中心<i class="lnr lnr-arrow-right"></i></a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6 p-0 order-lg-1 order-2">
                    <div class="facilities-text-warp">
                        <div class="facilities-text">
                            <h2>健康中心</h2>
                            <p>Lorem ipsum dolor sit amet, consectetur adipis-cing elit. Mauris tincidunt consectetur
                                turpis, eget consequat.</p>
                            <a href="#" class="primary-btn fac-btn">参观中心<i class="lnr lnr-arrow-right"></i></a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6 p-0 order-lg-2 order-1">
                    <div class="facilities-img set-bg"
                         data-setbg="${pageContext.request.contextPath}/static/img/facilities-2.jpg"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Facilities Section End -->

<div class="testimonial-section spad">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <div class="section-title">
                    <h1>留言簿</h1>
                    <span style="color:rgb(237,138,25)">${msg}</span>
                </div>
            </div>
        </div>
        <c:forEach items="${pageInfo.list}" var="advice">
            <div class="row">
                <div class="col-lg-12">
                    <div class="testimonial-item">
                        <div class="tab-content">
                            <div class="tab-pane fade-in active" id="testimonial-1" role="tabpanel">
                                <div class="single-testimonial-item">
                                    <span class="test-date"><fmt:formatDate value="${advice.createTime}"
                                                                            pattern="yyyy-MM-dd"/></span>
                                    <div class="test-rating">
                                        <i class="fa fa-star"></i>
                                        <c:if test="${pageInfo.pageNum!=1}">
                                            <i class="fa fa-star"></i>
                                        </c:if>
                                        <c:if test="${pageInfo.pageNum%2 == 0}">
                                            <i class="fa fa-star"></i>
                                        </c:if>
                                        <i class="fa fa-star"></i>
                                        <c:if test="${pageInfo.pageNum%3 == 0}">
                                            <i class="fa fa-star"></i>
                                        </c:if>
                                    </div>
                                    <h4>
                                        <c:choose>
                                            <c:when test="${pageInfo.pageNum==1}">
                                                糟糕
                                            </c:when>
                                            <c:when test="${pageInfo.pageNum/6==1}">
                                                很棒
                                            </c:when>
                                            <c:otherwise>
                                                一般
                                            </c:otherwise>
                                        </c:choose>
                                    </h4>
                                    <p>${advice.advice}</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <%--头像--%>
            <div class="row">
                <div class="col-lg-12">
                    <div class="testimonial-author-item">
                        <ul class="nav" role="tablist">
                            <li>
                                <a data-toggle="tab" href="#testimonial-1" role="tab" class="show active">
                                    <div class="author-pic">
                                        <c:if test="${pageInfo.pageNum%3==0 && pageInfo.pageNum!=2}">
                                            <img src="${pageContext.request.contextPath}/static/img/testimonial/author-1.jpg"
                                                 alt="">
                                        </c:if>
                                        <c:if test="${pageInfo.pageNum%3==2 || pageInfo.pageNum==2}">
                                            <img src="${pageContext.request.contextPath}/static/img/testimonial/author-2.jpg"
                                                 alt="">
                                        </c:if>
                                        <c:if test="${pageInfo.pageNum%3==1}">
                                            <img src="${pageContext.request.contextPath}/static/img/testimonial/author-3.jpg"
                                                 alt="">
                                        </c:if>
                                    </div>
                                    <div class="author-text">
                                        <h5>${advice.userName}<span>顾客</span></h5>
                                    </div>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <%--头像--%>
        </c:forEach>
<%--        分页--%>
        <div class="col-md-6 offset-md-4" style="text-align: center;width: 580px">
            <nav aria-label="Page navigation example">
                <ul class="pagination pagination-sm">
                    <li class="page-item"><a class="page-link"
                                             href="${pageContext.request.contextPath}/user/adviceShow?page=1">首页</a>
                    </li>
                    <c:if test="${pageInfo.hasPreviousPage}">
                        <li class="page-item"><a class="page-link"
                                                 href="${pageContext.request.contextPath}/user/adviceShow?page=${pageInfo.pageNum-1}">上一页</a>
                        </li>
                    </c:if>
                    <c:if test="${pageInfo.hasNextPage}">
                        <li class="page-item"><a class="page-link"
                                                 href="${pageContext.request.contextPath}/user/adviceShow?page=${pageInfo.pageNum+1}">下一页</a>
                        </li>
                    </c:if>
                    <li class="page-item"><a class="page-link"
                                             href="${pageContext.request.contextPath}/user/adviceShow?page=${pageInfo.pages}">末页</a>
                    </li>
                </ul>
            </nav>
        </div>
        <%--        分页--%>
    </div>
</div>

<!-- Follow Instagram Section Begin -->
<section class="follow-instagram">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <h2>在微博上关注我们 <a href="https://www.weibo.com/musiq">@阿信</a></h2>
            </div>
        </div>
    </div>
</section>
<!-- Follow Instagram Section End -->

<!-- Footer Room Pic Section Begin -->
<div class="footer-room-pic">
    <div class="container-fluid">
        <div class="row">
            <img src="${pageContext.request.contextPath}/static/img/room-footer-pic/room-1.jpg" alt="">
            <img src="${pageContext.request.contextPath}/static/img/room-footer-pic/room-2.jpg" alt="">
            <img src="${pageContext.request.contextPath}/static/img/room-footer-pic/room-3.jpg" alt="">
            <img src="${pageContext.request.contextPath}/static/img/room-footer-pic/room-4.jpg" alt="">
        </div>
    </div>
</div>
<!-- Footer Room Pic Section End -->

<!-- Footer Section Begin -->
<footer class="footer-section">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <div class="footer-logo">
                    <a href="#"><img src="${pageContext.request.contextPath}/static/img/logo.png" alt=""></a>
                </div>
            </div>
        </div>
        <div class="row pb-50">
            <div class="col-lg-3 col-sm-6">
                <div class="single-footer-widget">
                    <h5>地址</h5>
                    <div class="widget-text">
                        <i class="lnr lnr-map-marker"></i>
                        <p>四川省, <br/>成都市</p>
                    </div>
                </div>
            </div>
            <div class="col-lg-3 col-sm-6">
                <div class="single-footer-widget">
                    <h5>前台</h5>
                    <div class="widget-text">
                        <i class="lnr lnr-phone-handset"></i>
                        <p>028-82879625</p>
                    </div>
                </div>
            </div>
            <div class="col-lg-3 col-sm-6">
                <div class="single-footer-widget">
                    <h5>接车服务</h5>
                    <div class="widget-text">
                        <i class="lnr lnr-phone-handset"></i>
                        <p>028-82823625</p>
                    </div>
                </div>
            </div>
            <div class="col-lg-3 col-sm-6">
                <div class="single-footer-widget">
                    <h5>餐厅</h5>
                    <div class="widget-text">
                        <i class="lnr lnr-phone-handset"></i>
                        <p>028-82823825</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="copyright-area">
        <div class="container">
            <div class="copyright-text">
                <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
                Copyright &copy;<script>document.write(new Date().getFullYear());</script>
                <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. --></div>
            <div class="privacy-links">
                <a href="#">隐私政策</a>
            </div>
        </div>
    </div>
</footer>
<!-- Footer Section End -->


<!-- Js Plugins -->
<script src="${pageContext.request.contextPath}/static/js/userJS/jquery-3.3.1.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/userJS/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/userJS/jquery.magnific-popup.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/userJS/jquery-ui.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/userJS/jquery.nice-select.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/userJS/jquery.slicknav.js"></script>
<script src="${pageContext.request.contextPath}/static/js/userJS/owl.carousel.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/userJS/main.js"></script>
<script>
    $("#loginChk").click(function () {
        if (${user.loginName == null}) {
            alert("请先登录您的账号!")
            location.href = "${pageContext.request.contextPath}/user/loginInit"
        }else {
            location.href = "${pageContext.request.contextPath}/user/homeShowInit"
        }
    })
</script>

</body>

</html>
